<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		
		#box{
			width: 250px;
			height:250px;
			background-color: red;
			border:1px solid #000;
			/*在使用了CSS盒模型之后，offsetWidth会把padding margin border等盒模型的像素也加上去，造成计算错误，所以这个时候我们就不能再用了，以后也可以放弃使用这个东西，躲着它，简单来说，我们可以在 行内加个style样式,当然我们也知道，我们的样式也不可能都写在行间，所以我们可以写一个函数封装来解决*/
		  }	

	</style>

    <script type="text/javascript">
       
       function getStyle(obj,name){
       	 if (obj.currentStyle) {
       	 	return obj.currentStyle[name];
       	 }else{
       	 	return getComputedStyle(obj,true)[name];
       	 }
       }


    	window.onload=function(){

    	setInterval(function(){
            var box=document.getElementById('box');
            //box.style.width=box.offsetWidth-1+'px';
            box.style.width=parseInt(getStyle(box,'width'))-1+'px';
           
    	},30)

         }
    </script>


</head>
<body>
	<div id="box"></div>
</body>
</html>